<!--
* @description 单单位月报/季报
* @author zywu
* @date 2021/01/05 19:17:43
!-->
<template>
  <div class="wrapper-singleunit-report">
    <div class="page singleWeekly-page" data-page="singleWeekly" style="z-index: 2">
      <div class="link-page-top">
        <div class="link-page-title" id="weeklyTitle">{{orgName}}</div>
        <div class="link-top-btns">
          <img
            v-if="showShareBtn"
            id="sharePageBtn"
            src="../../assets/img/report/share.png"
            style="margin-right:15px;"
            @click="handleShare"
          />
          <audio-player :src="reportData.reportDesc"></audio-player>
        </div>
        <div class="link-date" id="weeklyTime">
          <span v-if="period==2">{{year}}年{{month}}月</span>
          <span v-else-if="period==5">{{year}}年第{{qaurter}}季度</span>
        </div>
      </div>
      <div class="page-content" style="overflow-y: auto;">
        <ul class="dataContent" id="dataContent">
          <safety-trend
            v-if="reportData.securitySituation"
            :report-data="reportData"
            :period="period"
            :period-name="periodName"
          ></safety-trend>
          <equip-intact v-if="showEquip" :report-data="reportData" :period="period" :period-name="periodName"></equip-intact>
          <review-police v-if="showReviewPolice" :report-data="reportData" :period="period" :period-name="periodName"></review-police>
          <daily-inspect v-if="showDailyInspect" :report-data="reportData" :period="period" :period-name="periodName"></daily-inspect>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
import { loadEcharts } from '@/utils/loadEcharts'
import { getPlatFormYearReport } from '@/api/yearReport'
import SafetyTrend from './SafetyTrend.vue' //安全态势
import EquipIntact from './EquipIntact.vue' //设备完好性
import ReviewPolice from './ReviewPolice' //接处警回顾
import AudioPlayer from '../../components/AudioPlayer.vue'
import '@/styles/report-unit.scss'
import DailyInspect from './DailyInspect.vue'
const reportData = require('@/mock/reportUnit.json')

export default {
  data() {
    return {
      isPlay: false,
      isresume: false,
      reportData: {},
      orgName: '',
      showShareBtn: true,
      period: '5', //2月报，5季报
      year: '',
      month: '',
      qaurter: '',
    }
  },

  components: {
    AudioPlayer,
    SafetyTrend,
    EquipIntact,
    ReviewPolice,
    DailyInspect,
  },

  computed: {
    showEquip() {
      return (
        this.reportData.equipmentCompleteness &&
        this.reportData.equipmentCompleteness.length > 0
      )
    },
    showReviewPolice() {
      return (
        this.reportData.changeOfPoliceSituation != '{}' &&
        this.reportData.changeOfPoliceSituation
      )
    },
    showHandlePolice() {
      return (
        this.policeHandling.policeHandling &&
        this.policeHandling.policeHandling.length > 0
      )
    },
    showDailyInspect() {
      var data = this.reportData
      return (
        data.aiResult ||
        data.hideDanger ||
        data.taskCompleteInfo ||
        data.mochaIiom ||
        data.controlRoom ||
        data.personnelDuty
      )
    },
  },

  created() {
    this.reportId = this.$route.query.reportId || 10623
    this.period = this.$route.query.period || 2
    this.periodName = this.period == 2 ? '月' : '季度'
    if (
      !/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent) &&
      !/(Android)/i.test(navigator.userAgent)
    ) {
      this.showShareBtn = false
    }
    loadEcharts().then(() => {
      this.getData()
    })
  },

  //mounted(){},

  methods: {
    handleShare() {
      let url = document.location.href
      let shareTitle = this.orgName
      let shareContent = ''
      if (this.period == 3) {
        shareContent = `${this.year}年第${this.qaurter}季度消防报表`
      } else if (this.period == 2) {
        shareContent = `${this.year}年${this.month}月消防报表`
      }
      parent.native.shareReport(
        decodeURIComponent(url),
        shareTitle,
        shareContent
      )
    },
    setData(data) {
      this.orgName = data.orgName
      this.reportData = data
      this.getMonthOrQaurter(data.startDate)
      console.log(data)
    },
    getData() {
      if (!this.reportId) {
        this.setData(reportData)
        return
      }
      getPlatFormYearReport({
        id: this.reportId,
      }).then((res) => {
        let data = JSON.parse(JSON.parse(this.xxbubs(res.data)))
        this.setData(data)
      })
    },
    xxbubs(str) {
      str = str.replace('f6ae12c1671b4ce48c3f90e9dd9d7608', '')
      return decodeURIComponent(
        atob(str)
          .split('')
          .map(function (c) {
            return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2)
          })
          .join('')
      )
    },
    getMonthOrQaurter(date) {
      let arr = date.split('-')
      this.year = arr[0]
      this.month = arr[1]
      this.qaurter = ['一', '二', '三', '四'][Math.ceil(this.month / 3) - 1]
    },
  },
}
</script>